<template>
	<view class="records ">
		<watermark></watermark>
		<view class="zyjz selector center" v-if="infoData.type !== 'team'">
			<view class="selector-li left-radius" :class="{active:type==='user' }" @click="changeTab('user')">
				个人
			</view>
			<view class="selector-li " :class="{active:type==='class'}" @click="changeTab('class')">
				班组
			</view>
			<view class="selector-li right-radius" :class="{active:type==='warehouse'}" @click="changeTab('warehouse')">
				仓库
			</view>
		</view>
		<view class="text-center mgn-t-30 mgn-b-30" @click="toggle('top')">
			<text class="uni-nav-bar-text mgn-r-10 clAAA">{{warehouse.text}}</text>
			<uni-icons type="arrowdown" color="#aaa" size="18" />
		</view>
		<uni-table stripe emptyText="暂无更多数据" border>
			<uni-tr>
				<uni-th align="center" width="210rpx" v-if="type === 'class'">班组</uni-th>
				<uni-th align="center" width="210rpx" v-else-if="type === 'user'">姓名</uni-th>
				<uni-th align="center" width="210rpx" v-else-if="type === 'warehouse'">仓库</uni-th>
				<uni-th align="center" width="180rpx">借</uni-th>
				<uni-th align="center" width="180rpx">还</uni-th>
				<uni-th align="center" width="180rpx" v-if="infoData.typp === 'admin'">金额</uni-th>
			</uni-tr>
			<uni-tr @rowClick="go(`./recordsDetails?type=${type}&typeId=${getTypeId(item)}&classId=${item.class_id}`)"
				v-for="(item,int) in items" :key="int">
				<uni-td align="center" v-if="type === 'class'">{{item.class_name}}</uni-td>
				<uni-td align="center" v-else-if="type === 'user'">{{item.user_name}}</uni-td>
				<uni-td align="center" v-else-if="type === 'warehouse'">{{item.warehouse_name}}</uni-td>
				<uni-td align="center">{{item.borrows_num}}</uni-td>
				<uni-td align="center">{{item.returns_num}}</uni-td>
				<uni-td align="center" v-if="infoData.typp === 'admin'">{{item.price}}</uni-td>
			</uni-tr>
		</uni-table>


		<uni-popup ref="popup" background-color="#fff" @change="change">
			<view class="text-center">
				<view class="pad-t-20 pad-b-20" v-for="(item,int) in warehouseList" :key="int" @click="changeW(item)">
					{{item.text}}
				</view>
			</view>

		</uni-popup>
	</view>
</template>

<script>
	import watermark from '@/components/watermark.vue'
	import mixins from '@/mixins/index.js'
	import business from '@/mixins/business.js'
	export default {
		mixins: [mixins, business],
		components: {
			watermark
		},
		data() {
			return {
				w_id: '',
				type: 'user',
				items: [],
				warehouse: {},

			}
		},
		onLoad() {
			this.getWarehouse(() => {
				this.warehouse = this.warehouseList[0]
				this.getList()
			}, this.infoData.user_id)
		},
		methods: {
			getTypeId(e) {
				switch (this.type) {
					case 'class':
						return e.class_id
					case 'user':
						return e.user_id
					case 'warehouse':
						return e.w_id
				}
			},
			changeW(e) {
				this.warehouse = e
				this.$refs.popup.close()
				this.getList()
			},
			changeTab(e) {
				this.items = []
				this.type = e
				this.getList()
			},
			getList() {
				const obj = {
					w_id: this.warehouse.id,
					type: this.type
				}
				this.api.get('logs', obj).then(res => {
					this.items = res.data
				})
			},
			onDet() {
				console.log(1111);
			},
			gogo() {
				// this.go('./review')
				this.go('../commom/inReview')
			},
			toggle(type) {
				this.popupType = type
				this.$refs.popup.open(type)
			},
		}
	}
</script>

<style lang="less">
	.records {
		.selector {

			.selector-li {
				padding: 15rpx 60rpx;
				background: #DDEBFF;
				border: 2rpx solid #3E86F4;
				font-size: 26rpx;
			}

			.left-radius {
				border-radius: 8rpx 0rpx 0rpx 8rpx;
			}

			.right-radius {
				border-radius: 0rpx 8rpx 8rpx 0rpx;
			}

			.active {
				background: #3E86F4;
				color: #fff;
			}
		}


	}
</style>